<!DOCTYPE html>
<html class="no-js" ng-app="test"><!--<![endif]-->
<head>
    <meta charset="utf-8">
    <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
    <title></title>
    <meta content="width=device-width" name="viewport">

    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css" />
    <link href="/dist/release/ui-grid.css" rel="stylesheet">

    <!--<script src="https://code.jquery.com/jquery-1.11.1.js"></script>-->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-route.min.js"></script>
    <script src="/dist/release/ui-grid.js"></script>

    <style>
        body {
            padding: 60px;
            min-height: 600px;
        }
        .grid {
            height: 50%;
            width: auto;
        }
        .placeholder {
            height: 50%;
            width: 50%;
            border: 3px solid black;
            background: #ccc;
        }
    </style>
</head>
<body ng-controller="Main">
  <div class="container">
      <ul>
        <li class="active"><a ng-href="#">Home</a></li>
        <li><a ng-href="#/noGrid">No Grid</a></li>
        <li><a ng-href="#/gridNoOptions">Grid No Options</a></li>
        <li><a ng-href="#/gridManyOptions">Grid Many Options</a></li>
      </ul>
  </div>

  <div ng-view=""></div>

  <br>
  <br>

  <script>
      var app = angular.module('test', ['ngRoute', 'ui.grid', 'ui.grid.selection', 'ui.grid.edit', 'ui.grid.cellNav', 'ui.grid.importer', 'ui.grid.exporter']);
      app.config(function ($routeProvider) {
        $routeProvider
          .when('/', {
            templateUrl: 'leak-main.html',
            controller: 'Main'
          })
          .when('/noGrid', {
            templateUrl: 'leak-no-grid.html',
            controller: 'NoGrid'
          })
          .when('/gridNoOptions', {
            templateUrl: 'leak-grid-no-options.html',
            controller: 'GridNoOptions'
          })
          .when('/gridManyOptions', {
            templateUrl: 'leak-grid-many-options.html',
            controller: 'GridManyOptions'
          })
          .otherwise({
            redirectTo: '/'
          });
      });
  
      app.controller('Main', function($scope){
        
      });

      app.controller('NoGrid', function($scope){
        
      });
      
      app.controller('GridNoOptions', function($scope, $http){
        $scope.gridOptions = { 
          data: 'data' 
        };
        $http.get('/misc/site/data/100.json')
        .success(function (data) {
          $scope.data = data;
        });
      });
      
      app.controller('GridManyOptions', function($scope, $http){
        $scope.gridOptions = { 
          data: 'data',
          enableGridMenu: true,
          importerDataAddCallback: function ( grid, newObjects ) {
            $scope.data = $scope.data.concat( newObjects );
          }
        };
        $http.get('/misc/site/data/100.json')
        .success(function (data) {
          $scope.data = data;
        });
      });
      
      app.controller('LeakBasic', function($scope, $http) {
          $scope.gridOptions = { data: 'data' };
          $scope.gridOptions = {
              enableFiltering: true
          };
          $scope.gridOptions.columnDefs = [
              {
                  name : "Name",
                  field: "name",
                  cellTemplate: '/misc/demo/cellTemplate.html'
              }
          ];
          $http.get('/misc/site/data/100.json')
                  .success(function (data) {
                      $scope.gridOptions.data = data;
                  });
      });
      
  </script>
</body>
</html>
        